import React, { Component } from 'react'
import Hello from './components/Hello'

export default class App extends Component {
  render() {
    return (
      <div>
        <h3>App</h3>
        {/* <Hello children='Hello World' /> */}
        {/* 里面包裹的子节点会被当作 children 属性传递，如上。 */}
        {/* <Hello>Hello World</Hello> */}
        {/* 当有一些复杂的 JSX 结构需要传递的时候建议下面写法 */}
        {/* <Hello>
          <div>
            <h3>Hayyp New Year</h3>
            <p>给大家拜个早年吧</p>
          </div>
        </Hello> */}
        {/* number */}
        {/* <Hello>{1}</Hello> */}
        {/* 还能传递函数 */}
        <Hello>
          {() => {
            {
              /* 可以在父组件做一些业务逻辑处理，把处理完之后的结果给子组件 */
            }
            return <h1>大家好</h1>
          }}
        </Hello>
      </div>
    )
  }
}
